<template>
  <li class="fl">
    <a @click="handleClick(type)">
      <img :src="imgPath">
      <p>{{formName}}</p>
    </a>
  </li>
</template>

<script type="text/javascript">
  import { openIFrame } from '@/utils/util'

  export default {
    name: 'IconFormComponents',
    props: {
      type: {
        type: Number,
        required: true,
      },
      formName: {
        type: String,
        required: true,
      },
      imgPath: {
        type: String,
        required: true,
      },
      routerPath: {
        type: String,
      },
      url: {
        type: String,
      }
    },
    methods: {
      handleClick(type) {
        switch (type) {
          case 1 :
            this.$router.push({ name: this.routerPath })
            break
          case 2:
            openIFrame(this.formName, this.routerPath, this.formName, this.url)
            this.$router.push({ name: this.formName })
            break
        }
      }
    }
  }
</script>